<template>
  <a-card>
    <div class="ant-card-head-wrapper">
      <div class="ant-card-head-title">
        <span class="title">运动</span>
        <span class="subtitle">数据时间：{{dataDate}}</span>
      </div>
      <div class="ant-card-extra">
        <a-button type="primary" @click="handleType('sport')">查看详情<a-icon type="caret-right" /></a-button>
      </div>
    </div>
    <div class="card-content">
      <a-card :bordered="false">
        <a-row>
          <a-col span="8">
            <a-statistic title="全天运动量" :value="sport.totalAmount || 0" style="margin-right: 50px" />
            <a-statistic title="全天步数" :value="sport.totalStepNumber || 0" />
            <a-statistic title="全天运动时长(分钟)" :value="sport.totalDuration || 0" />
          </a-col>
          <a-col span="8">
            <a-statistic title="室内运动量" :value="sport.amountIn || 0" style="margin-right: 50px" />
            <a-statistic title="室内步数" :value="sport.stepNumberIn || 0" />
            <a-statistic title="室内运动时长(分钟)" :value="sport.durationIn || 0" />
          </a-col>
          <a-col span="8">
            <a-statistic title="户外运动量" :value="sport.amount || 0" style="margin-right: 50px" />
            <a-statistic title="户外步数" :value="sport.stepNumber || 0" />
            <a-statistic title="户外运动时长(分钟)" :value="sport.duration || 0" />
          </a-col>
        </a-row>
      </a-card>
    </div>
  </a-card>
</template>
<script>
import { getAction } from '@/api/manage';

export default {
  name: 'sport',
  data() {
    return {
      url: {
        sportlist: "health/skSportRecord/getStudentSprotStatistical",
      },
      studentId: '',
      dataDate: '',
      nextDate: '',
      pageSize: 5,
      sport: {
      },
    }
  },
  props:[],
  components: {},
  filters: {},
  
  computed: {},
  
  created() {
    this.dataDate = this.$skCommon.getDate(0)
    this.nextDate = this.$skCommon.getDate(0)
  },
  
  activated() {
  },

  mounted() {
    // this.load();
  },

  methods: {
    load(dataForm) {
      this.dataDate =  dataForm.dataDate
      this.nextDate =  dataForm.dataDate
      this.studentId = dataForm.studentId
      this.loadSport();
    },
    loadSport() {
      let params = {
        studentId: this.studentId,
        startDate: this.dataDate,
        endDate: this.nextDate,
        byType: 'day'
      }
      getAction(this.url.sportlist, params).then(res => {
        console.log('sport', res.result)
        if(res.result.length > 0) {
          this.sport = res.result[0]
          this.sport.amountIn = Number(this.sport.totalAmount) - Number(this.sport.amount)
          this.sport.stepNumberIn = Number(this.sport.totalStepNumber) - Number(this.sport.stepNumber)
          this.sport.durationIn = Number(this.sport.totalDuration) - Number(this.sport.duration)
        }else{
          this.sport = {}
        }
      }).catch(()=>{
        this.sport.loading = false
      })
    },
    handleType(type){
      this.$emit('detail', type)
    },
  }
}
</script>
<style scoped lang="less">

</style>